<template>
  <el-container>
    <el-header>
      <h2>自然语言处理</h2>
    </el-header>
    <el-main>
      <el-form :model="form" label-width="150px">
        <el-form-item label="模型类型">
          <el-radio-group v-model="form.modelType">
            <el-radio label="基于规则的模型">基于规则的模型</el-radio>
            <el-radio label="神经网络">神经网络</el-radio>
            <el-radio label="预训练模型">预训练模型</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="分词方式">
          <el-radio-group v-model="form.segmentationMethod">
            <el-radio label="基于辞典的分词">基于辞典的分词</el-radio>
            <el-radio label="统计分词">统计分词</el-radio>
            <el-radio label="深度学习分词">深度学习分词</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="语料库选择">
          <el-checkbox-group v-model="form.corpusSelection">
            <el-checkbox label="新闻">新闻</el-checkbox>
            <el-checkbox label="法律">法律</el-checkbox>
            <el-checkbox label="医学">医学</el-checkbox>
            <el-checkbox label="生活">生活</el-checkbox>
            <el-checkbox label="食谱">食谱</el-checkbox>
            <el-checkbox label="建筑">建筑</el-checkbox>
            <el-checkbox label="旅游">旅游</el-checkbox>
          </el-checkbox-group>
        </el-form-item>

        <el-form-item label="停用词处理">
          <el-input v-model="form.stopWords" type="textarea" />
        </el-form-item>

        <el-form-item label="上下文追踪">
          <el-switch v-model="form.contextTracking" />
        </el-form-item>

        <el-form-item label="同义词辞典">
          <el-switch v-model="form.synonymDictionary" />
        </el-form-item>

        <el-form-item label="日志记录">
          <el-switch v-model="form.logRecording" />
        </el-form-item>

        <el-form-item label="响应延迟（秒）">
          <el-input v-model="form.responseDelay" type="number" />
        </el-form-item>

        <el-form-item label="并发处理">
          <el-input v-model="form.concurrentProcessing" type="number" />
        </el-form-item>

        <el-form-item label="语言检测">
          <el-radio-group v-model="form.languageDetection">
            <el-radio label="中文">中文</el-radio>
            <el-radio label="英文">英文</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="翻译选项">
          <el-switch v-model="form.translationOption" />
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="save">保存</el-button>
          <el-button @click="cancel">取消</el-button>
        </el-form-item>
      </el-form>
    </el-main>
  </el-container>
</template>

<script>
import { ref } from "vue";
import { ElMessage } from "element-plus";

export default {
  setup() {
    const form = ref({
      modelType: "基于规则的模型",
      segmentationMethod: "基于辞典的分词",
      corpusSelection: ["新闻", "生活", "旅游"],
      stopWords: "骗子,人渣",
      contextTracking: true,
      synonymDictionary: true,
      logRecording: true,
      responseDelay: 5,
      concurrentProcessing: 100,
      languageDetection: "中文",
      translationOption: true
    });

    const save = () => {
      // 提示保存成功
      ElMessage.success("保存成功！");
      console.log("保存的数据:", form.value);
      // 这里可以添加 API 调用
    };

    const cancel = () => {
      // 取消逻辑
      console.log("取消操作");
      // 可以重置表单或返回上一个页面
    };

    return { form, save, cancel };
  }
};
</script>

<style scoped>
.el-header {
  padding: 20px;
  text-align: center;
  background-color: #f5f7fa;
}
</style>
